import React from "react";
import "./login.css"
import $ from "jquery"
class Login extends React.Component{
    constructor(props){
        super(props)
        this.state={
            username:"",
            password:""
        }
    }
    usereNameChange(e){
        this.setState({
            username:e.target.value
        })
    }
    passwordChange(e){
        this.setState({
            password:e.target.value
        })
    }
    onSubmit(){
        let that=this
        $.ajax({
            url:"/user/login",
            type:"POST",
            headers:{
                'Content-Type':'application/json'
            },
            dataType:"json",
            data:JSON.stringify({
                user_name:that.state.username,
                pass_word:that.state.password
            })
        }).then((res)=>{
            if(res.errCode==0){
                window.localStorage.setItem("userInfo",JSON.stringify(res.data.userId+"_"+res.data.token))
                that.props.history.push("/")
            }else{
                alert(res.msg)
            }
        },(err)=>{
            console.log(err)
        })
    }

    //回车登录
    
    render(){
        return(
            
                <div className="col-md-4 col-md-offset-4">
                    <div className="panel panel-default logon-form">
                    <div className="panel-heading">欢迎登陆管理系统</div>
                    <div className="panel-body"> 
                    <form>
                        <div className="form-group">
                        <input type="text" className="form-control"  placeholder="请输入用户名" 
                        onChange={this.usereNameChange.bind(this)} />
                        </div>
                        <div className="form-group">
                        
                        <input type="password" className="form-control"  placeholder="请输入密码" 
                        onChange={(e)=>this.passwordChange(e)}/>
                        </div>
                        
                        <button className="btn btn-lg btn-primary btn-block" onClick={this.onSubmit.bind(this)}>登陆</button>
                    </form>
                    </div>
                </div>
                </div>
            
            
        )
    }
}
export default Login